<template>
    <div style="background:white;height:100%">
        <v-toolbar dark color="primary" style="box-shadow:none">
            <v-icon>keyboard_arrow_left</v-icon>
            <v-toolbar-title style="margin:0" @click="$router.back(-1)">社区公告</v-toolbar-title>
        </v-toolbar>
        <v-layout row>
            <v-flex xs12 sm6 offset-sm3>
            <v-card>
                <v-list two-line>
                <template v-for="(item, index) in announcements">
                    <v-list-tile :key="index" avatar ripple @click="$router.push('/home/'+item.announcementId+'/announcement')">
                    <v-list-tile-content>
                        <v-list-tile-title class="text--primary">{{ item.announcementTitle }}</v-list-tile-title>
                        <v-list-tile-sub-title>{{ item.announcementContent }}</v-list-tile-sub-title>
                    </v-list-tile-content>
                    </v-list-tile>
                    <v-divider v-if="index + 1 < announcements.length" :key="`divider-${index}`"></v-divider>
                </template>
                </v-list>
            </v-card>
            </v-flex>
        </v-layout>
    </div>
</template>

<script>
export default {
    data(){
        return {
            announcements: [
                { announcementId:'1',announcementTitle: '停水通知',announcementContent: "信息学部各用户：因配合信息学部专用中心配电室一回供电电源（茶绘线）改迁后的接驳工作，定于2018年5月31日（周四）及6月5日（周二）上午6时至7时进行倒闸操作。届时信息学部将短时停电、停水，请各用户做好停电、停水准备，由此带来的不便，敬请谅解。" },
                { announcementId:'2',announcementTitle: '停水通知',announcementContent: "信息学部各用户：因配合信息学部专用中心配电室一回供电电源（茶绘线）改迁后的接驳工作，定于2018年5月31日（周四）及6月5日（周二）上午6时至7时进行倒闸操作。届时信息学部将短时停电、停水，请各用户做好停电、停水准备，由此带来的不便，敬请谅解。" },
                { announcementId:'3',announcementTitle: '停水通知',announcementContent: "信息学部各用户：因配合信息学部专用中心配电室一回供电电源（茶绘线）改迁后的接驳工作，定于2018年5月31日（周四）及6月5日（周二）上午6时至7时进行倒闸操作。届时信息学部将短时停电、停水，请各用户做好停电、停水准备，由此带来的不便，敬请谅解。" },
                { announcementId:'4',announcementTitle: '停水通知',announcementContent: "信息学部各用户：因配合信息学部专用中心配电室一回供电电源（茶绘线）改迁后的接驳工作，定于2018年5月31日（周四）及6月5日（周二）上午6时至7时进行倒闸操作。届时信息学部将短时停电、停水，请各用户做好停电、停水准备，由此带来的不便，敬请谅解。" },
                { announcementId:'5',announcementTitle: '停水通知',announcementContent: "信息学部各用户：因配合信息学部专用中心配电室一回供电电源（茶绘线）改迁后的接驳工作，定于2018年5月31日（周四）及6月5日（周二）上午6时至7时进行倒闸操作。届时信息学部将短时停电、停水，请各用户做好停电、停水准备，由此带来的不便，敬请谅解。" },
            ]
        }
    },
    methods:{
        getAnnouncements(){
            this.$axios({
                method:'get',
                url:this.SERVER+'/announcements',
                params:{
                    announcementType:0
                },
                headers:{
                    'Content-Type':'multipart/form-data',
                    'Authorization':'bearer'+localStorage.getItem('Access-Token')
                }
            }).then(
                function(response){
                    var res=response.parseJSON()
                    this.anouncements=res['rows']
                }
            ).catch({
                function(response){
                    console.log(response)
                }
            })
        }
    },
    mounted(){
        // this.getAnnouncements
    }
}
</script>

